<template>
  <div>
    <a-row>
      <a-col :span="11">
        <SearchField
          placeholder="申请表"
          :disabled="disabled"
          :f_treeData="firstList"
          @f_setField="firstChange"
          :value="firstValue"
        ></SearchField>
      </a-col>
      <a-col :span="2" align="center">==</a-col>
      <a-col :span="11">
        <SearchField
          placeholder="表单控件"
          :disabled="disabled"
          :f_treeData="lastList"
          @f_setField="lastChange"
          :value="lastValue"
        ></SearchField>
      </a-col>
    </a-row>
  </div>
</template>

<script>
export default {
  props: {
    // 是否禁用
    disabled: {
      type: Boolean,
      default: false
    },
    // 左侧数据源
    firstList: {
      type: Array,
      default: () => {
        return []
      }
    },
    // 左侧绑定值
    firstValue: {
      type: String,
      default: ''
    },
    // 右侧数据源
    lastList: {
      type: Array,
      default: () => {
        return []
      }
    },
    // 右侧绑定值
    lastValue: {
      type: String,
      default: ''
    }
  },
  data() {
    return {}
  },
  components: {
    SearchField: () => import('@/views/businessAssembly/public/spareparts/searchField')
  },
  mounted() {},
  methods: {
    // 左侧change事件
    firstChange(value) {
      this.$emit('firstChange', value)
    },
    // 右侧change事件
    lastChange(value) {
      this.$emit('lastChange', value)
    }
  }
}
</script>

<style lang="less" scoped></style>
